<!DOCTYPE html>
<html>
<head>
    <style type="text/css">
        div#container {
            width: 500px;
            margin:0 auto
        }

        div#header {
            background-color: #99bbbb;
        }

        div#menu {
            background-color: #ffff99;
            height: 200px;
            width: 150px;
            float: left;
        }

        div#content {
            background-color: #EEEEEE;
            height: 200px;
            width: 350px;
            float: left;
        }

        footer#footer {
            background-color: #99bbbb;
            clear: both;
            text-align: center;
        }

        h1 {
            margin-bottom: 0;
        }

        h2 {
            margin-bottom: 0;
            font-size: 18px;
        }

        ul {
            margin: 0;
        }

        li {
            list-style: none;
        }
    </style>
</head>

<body>

<div id="container">

    <div id="header">
        <h1>Main Title of Web Page</h1>
    </div>

    <div id="menu">
        <h2>Menu</h2>
        <ul>
            <li>HTML</li>
            <li>CSS</li>
            <li>JavaScript</li>
        </ul>
    </div>

    <div id="content">Content goes here</div>

    <footer id="footer">Copyright com.foreveross.com</footer>
    <!--<div id="footer">Copyright W3School.com.cn</div>-->

</div>

</body>
</html>
